<!DOCTYPE html>
<html lang="en">
	<head>
    	<meta name="layout" content="main_mobile">
        <title>火堆</title>       
        <link rel="stylesheet" href="${resource(dir: 'css', file: 'donate_list_2.0.css')}" type="text/css">
        <script type="text/javascript" src="${resource(dir: 'js', file: 'jquery-1.10.2.js')}" ></script>
        <style>
        .ui-nowrap {
		    white-space: inherit;
		}
        </style>  
    </head>
    
<body>

    <section class="ui-container">
        <ul class="ui-tiled ui-nav">
            <li id="nlist" class="active"><a href="#" onclick="show('normalList');$('#nlist').addClass('active');removeActive('slist');">爱心捐款</a></li>
            <li id="slist" class=""><a href="#" onclick="show('subList');$('#slist').addClass('active');removeActive('nlist');">一起捐</a></li>
        </ul>
        <div class="content">
            <ul>
                <li id="normalList" class="active">
                    <ul id="normal" class="ui-list ui-border-b sf">
                    	<%--<g:if test="${donates != null}">
                        <g:each in="${donates}" var="donate">
			            <li class="ui-border-t">
			                <div class="ui-avatar">
			                	<g:if test="${donate.member.headimgurl!=null}">
			                			<span style="background-image:url(${donate.member.headimgurl})"></span>
			                	</g:if>
			                	<g:elseif test="${donate.member.headimgurl==null}">
			                			<span style="background-image:url(${resource(dir:'images/demo',file:'demo-avatar-1.jpg')})"></span>
			                	</g:elseif>
			                </div>
			                <div class="ui-list-info">
			                    <h4 class="ui-nowrap">${donate.member.nickname}</h4>
			                    <g:if test="${donate?.donate_fee == 0 }">
			                    	<p class="ui-nowrap">支持了<em><g:formatNumber number="${donate?.money}" format="0.00"/></em>元</p>
			                    </g:if>
			                    <g:else>
			                    	<p class="ui-nowrap">支持了<em><g:formatNumber number="${donate?.donate_fee}" format="0.00"/></em>元</p>
			                    </g:else>
			                    <p class="ui-nowrap">${donate.comment?.text}</p>
			                 </div>
			                 <div class="date"><g:formatDate format="MM-dd HH:mm" date="${donate.date}"/></div>
			            </li>
			            </g:each>
			            </g:if>
                    --%></ul>                
				          <div class="ui-line more"><p id="week" style="" onclick='' >点击加载更多</p></div>
                </li>
                <li id="subList" >
                	
                	<div class="ui-line ui-border-b">
			           
			        </div>
			        
                    <ul class="ui-list ui-border-b sf " id = "sublistul">
                    <%--<div class="ui-line ui-border-b">
			            <p>感谢<em>${subLoveCount}</em>位爱心传播者和 <em>${subdonateCount}</em> 位爱心伙伴</p>
			        </div>
                    	--%><%--<g:if test="${subDonates != null}">
                    	<g:each in="${subDonates}" var="subDonate">
                        <li class="ui-border-t"   onclick="window.location.href='/scfire/subProject/subProjectDetail?subprojectid=${subDonate.id}'">
                            <div class="ui-avatar">
                                <g:if test="${subDonate.member.headimgurl!=null}">
			                			<span style="background-image:url(${subDonate.member.headimgurl})"></span>
			                	</g:if>
			                	<g:elseif test="${subDonate.member.headimgurl==null}">
			                			<span style="background-image:url(${resource(dir:'images/demo',file:'demo-avatar-1.jpg')})"></span>
			                	</g:elseif>
                            </div>
                            <div class="ui-list-info">
                                <h4 class="ui-nowrap">${subDonate.member.nickname}</h4>
                                <p class="ui-nowrap gray">和<em>${subDonate.donates.size()}</em>位伙伴筹得善款<em>${subDonate.subdonate}</em>元</p>
                                <p>${subDonate.subdescription}</p>
                            </div>
                        </li>
                        </g:each>
                        </g:if>
                    --%></ul>
				          <div class="ui-line more"><p id="week1" style="" onclick='' >点击加载更多</p></div>
                </li>
            </ul>
        </div>
        
        
<%--        <div class="banner-wrap">--%>
<%--            <div class="txt-bottom"><a href="http://mp.weixin.qq.com/mp/homepage?__biz=MzAxNjM5NzExOQ==&hid=3&sn=e498fbdd2e826943340c0729061ac868#wechat_redirect">了解火堆</a><a href="/scfire/project/qrcode">关注火堆</a><img src="../images/ic-qrcode.png" alt=""></div>--%>
<%--            <img class="img-bottom" src="../images/logo_and_txt.png" alt="" class="ui-introduction">--%>
<%--        </div>  --%>
    </section>
    <script src="../frozen/lib/zeptojs/zepto.min.js"></script>
    <script src="../frozen/js/frozen.js"></script>
    <script>
    
    </script>
	<script type="text/javascript">
	var finalOffset= 20

	function IsPC() 
 	{ 
 	var userAgentInfo = navigator.userAgent; 
 	var Agents = new Array("Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"); 
 	var flag = true; 
 	for (var v = 0; v < Agents.length; v++) { 
 	if (userAgentInfo.indexOf(Agents[v]) > 0) { flag = false; break; } 
 	} 
 	return flag; 
 	}


	
	function show(id){
        $('#normalList').removeClass('active');
        $('#subList').removeClass('active');
        $("#"+id).addClass("active");
        if(id=="subList"){
            if($("#sublistul").val()==""){
            	ajaxList(); 
                }

            }
    }

	function removeActive(id){
		$('#'+id).removeClass('active');
	}
	var offset = 0
	ajaxRead();
    function ajaxRead(){
        var html="";  
    	$.ajax({  
            type:'get',  
            dataType:'json',
            url:'/scfire/donate/donateList2?format=json&offset='+ offset+'&projectId='+${project?.id},  		           
            beforeSend:function(){console.log('loading...');$("#week").html('加载中...');},  
            success:function(data){
          	  $.each(data,function(i,item){
          		offset++
          		//console.log(item)
          		html+="<li class='ui-border-t'>"
          		html+="<div class='ui-avatar'>"
                
                if(item.headimgurl!=null){
                	html+="<span style='background-image:url("+item.headimgurl+")'></span>"
                }else if(item.headimgurl==null){
                	html+="<span style='background-image:url(../images/demo/demo-avatar-1.jpg)'></span>"
                }
          		html+="</div>"
          		html+="<div class='ui-list-info'>"
              		if(null==item.nickname){
              		html+="<h4 class='ui-nowrap'>爱心天使</h4>"
                  	}
                  	else{
                  		html+="<h4 class='ui-nowrap'>"+csubstr(item.nickname,8)+"</h4>"
                      	}
          		
          		if(item.fDonatemoney == 0){
          			html+="<p class='ui-nowrap'>已捐<em>"+item.donate_fee.toFixed(2)+"</em>元</p>"
          		}else{
          			html+="<p class='ui-nowrap'>已捐<em>"+item.donate_fee.toFixed(2)+"</em>元， 配捐<em>"+item.fDonatemoney.toFixed(2)+"</em>元</p>"
          		}
          		if(item.text !=null){
              		html+="<p class='ui-txt-sub'>"+item.text+"</p>"
              	}
                    
          		html+="<div class='date'>"+item.date+"</div>"
          		html+="</div>"
          		html+="<div class='stayle'></div>"
          		html+="</li>"
          
          	  });
          	  
          	  //html += "<div class="ui-line more"><p id="week" style=""  onclick="ajaxRead();">点击加载更多</p></div>"
	          //$("#week").remove();
              $("#normal").append($(html));
              if(data.length<finalOffset){       				
  				$("#week").html("已经到底了")
  				$("#week").removeAttr("onclick");
  				
      		}else{
      			
 	            $("#week").html("加载更多")
 	            $("#week").attr("onclick","ajaxRead()");
          		}
            },  
            complete:function(){console.log('mission complete.')} ,
            error:function(data){
          	  $("#week").html('已经到底了');
            }
           
      });
       }





    var offset1 = 0

    function ajaxList(){
	         var html="";  
	     	$.ajax({  
	             type:'get',  
	             dataType:'json',
	             url:'/scfire/donate/subDonateList?format=json&offset='+ offset1+'&projectId='+${project?.id},  		           
	             beforeSend:function(){console.log('loading...');$("#week1").html('加载中...');},  
	             success:function(data){

		             var flag = IsPC();
		             
	           	  $.each(data,function(i,item){
	           		offset1++
	           		//console.log(item)
	           		if(flag==true){
		           		html+="<li class='ui-border-t'>"
		           		}else{
			           		html+="<li class='ui-border-t'  onclick=\"window.location.href=\'/scfire/subProject/subProjectDetail?subprojectid="+item.id+"\'\">"
			           		}
	           		
	           		html+="<div class='ui-avatar'>"
	                 
	                 if(item.headimgurl!=null){
	                 	html+="<span style='background-image:url("+item.headimgurl+")'></span>"
	                 }else if(item.headimgurl==null){
	                 	html+="<span style='background-image:url(../images/demo/demo-avatar-1.jpg)'></span>"
	                 }
	           		html+="</div>"
	           		html+="<div class='ui-list-info'>"
	           		html+="<h4 class='ui-nowrap'>"+item.nickname+"</h4>"
	           		if(item.donate_fee==0){
		           		html+="<p class='ui-nowrap gray'>和<em>"+item.subdonateSize+"</em>位伙伴筹得善款<em>"+item.subdonate.toFixed(2)+"</em>元</p>"
		           		}else{
			           		html+="<p class='ui-nowrap gray'>和<em>"+item.subdonateSize+"</em>位伙伴筹得善款<em>"+item.subdonate.toFixed(2)+"</em>元，爱心池配捐<em>"+item.donate_fee.toFixed(2)+"</em>元</p>"
			           		}
	           		html+="<p>"+item.description+"</p>"
	           		html+="</li>"
	           
	           	  });
	           	  
	           	  //html += "<div class="ui-line more"><p id="week" style=""  onclick="ajaxRead();">点击加载更多</p></div>"
	 	          //$("#week").remove();
	               $("#sublistul").append($(html));
	               if(data.length<finalOffset){       				
	    				$("#week1").html("已经到底了")
	    				$("#week1").removeAttr("onclick");
	    				
	        		}else{
	        			
	   	            $("#week1").html("加载更多")
	   	            $("#week1").attr("onclick","ajaxList()");
	            		}
	             },  
	             complete:function(){console.log('mission complete.')} ,
	             error:function(data){
	           	  $("#week1").html('已经到底了');
	             }
	      });
      }
    function csubstr(str,len){
   	 if(str.length>9){
   	  return str.substring(0,len)+"...";
   	 }else{
   	  return str;
   	 }
   	}
    
	</script>

</body>
</html>